<script setup>
import {listMyProject,cancelCreateProject} from "@/api/project.js";
import {useUserStore} from "@/stores/user.js";
import {ref} from "vue";

const userStore = useUserStore()
const myProject_data = ref([]);

const userId = userStore.userDetails.userId;

const  handleClicklistMyProject = async () => {
  const response = await listMyProject(userId,3,1);
  if(response.data.code === 200){
    myProject_data.value = response.data.data;
  }
  else{
    console.log("Error");
  }
}
import {ElMessage, ElMessageBox} from 'element-plus';
import routes from "@/router/index.js";

const handleCancel = async (projectId) => {
  // 弹出确认对话框
  ElMessageBox.confirm('确定要取消这个项目吗？', '确认取消', {
    confirmButtonText: '确定',
    cancelButtonText: '取消',
    type: 'warning'
  })
      .then(async () => {
        // 用户点击了“确定”按钮
        const response = await cancelCreateProject(projectId);
        if (response.data.code === 200) {
          ElMessage.success("取消创建项目成功");
          await handleClicklistMyProject();
        } else {
          ElMessage.error("取消创建项目失败");
        }
      })
      .catch(() => {
        // 用户点击了“取消”按钮
        ElMessage.info('取消操作');
      });
}
const goToDetailPage = (productId) => {
  routes.push({path: '/project-details', query: {productId}});
};
handleClicklistMyProject();
</script>

<template>
  <h1 style="text-align: center; margin-top: 20px;margin-left: -80px">创建被驳回的项目</h1>

  <el-table border :data="myProject_data" style="width: 100%;margin-top: 20px">
    <el-table-column prop="projectName" label="项目名称" width="100"></el-table-column>
    <!--    项目图片-->
    <el-table-column prop="projectImg" label="项目图片" width="120">
      <template #default="{ row }">
        <img :src="row.image" alt="项目图片" style="width: 80px; height:80px;" class="table-image" />
      </template>
    </el-table-column>
    <el-table-column prop="lab" label="实验室" width="100"></el-table-column>
    <el-table-column prop="teacherName" label="指导老师" width="100"></el-table-column>
    <el-table-column prop="userName" label="负责人" width="100"></el-table-column>
    <!--      开始时间 {{ new Date(pendingProjects.startTime).toLocaleDateString() }} -->
    <el-table-column label="开始时间" width="100">
      <template #default="{ row }">
        <el-button type="text" @click="() => {}">
          {{ new Date(row.startTime).toLocaleDateString() }}
        </el-button>
      </template>
    </el-table-column>
    <!--      结束时间 -->
    <el-table-column label="结束时间" width="140">
      <template #default="{ row }">
        <el-button type="text" @click="() => {}">
          {{ new Date(row.endTime).toLocaleDateString() }}
        </el-button>
      </template>
    </el-table-column>
    <el-table-column  label="驳回原因" width="200" >
      <template #default="{ row }">
        <p style="color:red;font-weight: bold">{{ row.remark }}</p>
      </template>

    </el-table-column>



  </el-table>

</template>

<style scoped>

</style>